<template>
  <!-- 业务宣传 -->
  <view class="businessPublicity">
    <view class="wrapper">
      <view class="list-wrapper">
        <view class="item funItem" v-for="(item, index) in publicityList" :key="index" :data-url="`${item.url}`"
          @click="handleClickRouter">
          <image class="img" :src="item.iconUrl"></image>
          <view class="text">{{ item.informationName }}</view>
        </view>
      </view>
    </view>
  </view>
</template>

<script>
  import {
    handleClickRouter
  } from "@/utils/util.js";
  import StateAntifraud from '../stateApp/stateAntifraud.vue'

  export default {
    name: "businessPublicity",
    components: {
      StateAntifraud
    },
    data() {
      return {
        baseImgUrl: this.$baseImgUrl,
        imgPrefix: uni.getStorageSync("imgPrefix"),
        publicityList: [{
          id: 1,
          informationName: "国家反诈APP",
          value: 0,
          iconUrl: this.$baseImgUrl + "publicityIcon_1.png",
          url: "/stateApp/stateApp/stateAntifraud",
        }, ],
      };
    },
    onShow() {},
    methods: {
      handleClickRouter,
    },
  };
</script>

<style lang="scss">
  .businessPublicity {
    height: 100%;
    background: #f6f6f6;
    overflow-y: hidden;
    padding: 16rpx 24rpx;

    .wrapper {
      padding: 34rpx 40rpx 0;
      height: 97vh;
      background: #ffffff;
    }

    .list-wrapper {
      display: flex;
      font-size: 24rpx;
      flex-wrap: wrap;
      color: #272727;
      bottom: 14.543vh;
      left: 25rpx;

      .item {
        position: relative;
        text-align: center;
        width: 25%;

        .badgeText {
          top: -15rpx;
          right: 18rpx;
        }

        .img {
          margin-bottom: 1vh;
          width: 88rpx;
          height: 88rpx;
        }

        .text {
          color: #343434;
          font-size: 26rpx;
          line-height: 1;
        }
      }

      .funItem:nth-of-type(-n + 8) {
        padding-bottom: 30rpx;
      }
    }
  }
</style>